<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="static/easyui/jquery.min.js"></script>
<script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" href="static/easyui/themes/metro-gray/easyui.css"/>
<link rel="stylesheet" href="static/easyui/themes/icon.css"/>
<title>角色管理</title>
</head>
<body>
	<script type="text/javascript">
		
		function grantwin(roleId){
			//去除表格的选中
			$("#role-list").datagrid("unselectAll");
			$("#grant-win").attr("data-value",roleId);
			//打开窗口
			$("#grant-win").window("open");
			//初始化树形结构
			$("#grant-tree").tree({
				checkbox:true,
				url:'init-grant?roleId='+roleId,
				onlyLeafCheck:true
			})
		}
		//删除角色
		function shanchu(roleId){
			alert(roleId);
			$.ajax({		       
		        url:"deleteRole",
		        data:{'roleId':roleId},
		 		type:"post",
		        success:function(data){
				     $('#role-list').datagrid('reload');       
				    },				
				});
				
		}
		
		//新增角色打开窗口
		function tianjiajuese(){			
		$("#addrolep").window("open");			
		}
	
		//新增角色	
		$("#addtianjierole").click(function(){			
			$('#dd').form({    
			    url:'addrole',    
			    onSubmit: function(){    
			    }, 
			    //表单提交成功之后的数据
			    success:function(data){ 
			    	 $('#addrolep').window('close');
			    	  $('#role-list').datagrid('reload');
			    }    
			}).submit();  		
		});	
	
		
		
			
		
		
		//获取页面的二级功能id
		var jq = top.jQuery;
		var funId=jq("#tt").tabs("getSelected").panel('options').id;
		
		//去重
		function btns(value){
			 return button.onClick(new Set(value));
		}
		
		//初始化三级的功能按钮
		var btns = function(value,row,index){
			var str="";
			$.ajax({
				url:'init-thirdfuns',
				type:'post',
				data:{
					funId:funId//参数为2级的功能id
				},
				async:false,//是否异步刷新
				success:function(data){
					for (var i = 0; i < data.length; i++) {
						str += "<input type='button' onClick='"+data[i]['function_url']+"("+row.roleId+")' value='"+data[i]['function_name']+"'/>";
					}
				}
			})
	return str;
}
		
		$(function(){
			
			//关闭授权窗口
			$("#close-grant").click(function(){
				$("#grant-win").window("close");
			});
			//访问数据源、初始化表格
			$('#role-list').datagrid({
			    url:'role-list',
			    columns:[[
					{field:'roleId',title:'角色编号',width:100,fixed:true,checkbox:true,hidden:true},
					{field:'roleName',title:'角色名称',width:515,fixed:true},
					{field:'cc',title:'操作',width:513.5,fixed:true,
						formatter:btns	
					}
			    ]]
			});
			
			//点击保存按钮，获得角色id和所有选中功能id
			$("#save-grant").click(function(){
				var roleId = $("#grant-win").attr("data-value");
				//获取树形结构中所有选中的节点
				var nodes = $('#grant-tree').tree('getChecked', ['checked','indeterminate']);
				//将所有节点的id存入数组
				var functionIds = [];
				for (var i = 0; i < nodes.length; i++) {
					//这是三级
					functionIds.push(nodes[i].id);
					//这是二级
					var parent = $("#grant-tree").tree("getParent", nodes[i].target);
					if(parent != null){
						functionIds.push(parent["id"]);
						//这是一级
						var root = $("#grant-tree").tree("getParent",parent.target);
						if(root != null){
							functionIds.push(root["id"]);
						}
					}
				}
				//去重
				function dedupe(array){
					 return Array.from(new Set(array));
				}
				functionIds = dedupe(functionIds) //保证一级和二级在数组中不重复
				//提交到controller
				$.ajax({
					url:'sava-grant',
					type:'post',
					data:{
						roleId:roleId,
						funIds:JSON.stringify(functionIds)
					},
					success:function(){
						$("#grant-win").window("close");
					}
				}); 
			});
		});
		$.extend($.fn.textbox.defaults.rules, {
		    //姓名验证
			juese: {
		        validator: function(value, param) {
		            var reg = /^[\u4e00-\u9fa5]+$/i;
		            return reg.test(value);
		        },
		        message: "请输入中文"
		    }
		    
   });//自定义验证
	</script>
<div class="maxbox easyui-panel"  data-options="fit:true" style="border:1px solid #F3F3F4;">
	

	<fieldset style="border:1px solid #A6A6A6;border-radius:6px;width:1050px;margin:0 auto;margin-top:20px;margin-bottom:20px;padding: 20px;">
         <legend style="font-size:17px;">角色管理</legend>
         <div style="">
	  <table id="role-list"  class="easyui-datagrid" data-options="fitColumns:true,width:1030">

		
	 </table>
	</div>
	 <div class="button" style="float: right;margin-top: 18px; margin-right: 18px;">
    	<a  class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="tianjiajuese()">添加</a>      
     </div>
	</fieldset>
	
	<div class="easyui-window" id="grant-win" title="给角色授权" style="width:350px;height:500px;" data-options="closed:true,minimizable:false,maximizable:false,collapsible:false">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'south',border:false" style="height:30px;text-align:right">
				<a id="save-grant" class="easyui-linkbutton" >保存</a>
				<a id="close-grant" class="easyui-linkbutton" >取消</a>
			</div>
			<div data-options="region:'center'">
				<ul class="easyui-tree" id="grant-tree"></ul>
			</div>
	    </div>
	</div>
	
	<div class="easyui-window" id="addrolep" title="添加角色" style="width:400px;height:250px;" data-options="closed:true,resizable:false, 
	minimizable:false,maximizable:false,collapsible:false">
	    <p style="margin-left: 42%;font-size:18px;">添加角色</p>
		<div class="easyui-layout" data-options="fit:true">					
				<form id="dd" method="post">   
					 <div style="font-size: 17px;float: left;margin-left: 98px;margin-top:15px;margin-bottom: 20px;">   
				      	  <span style="margin-right:8px;">角色</span>
				      	 <input class="easyui-textbox" required="true" style="width:120px;height:27px;" name="rolename1" data-options="validType:['juese']" />   				          
				    </div>
					     <a style="margin-left:168px;margin-top: 37px;" id="addtianjierole"  class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确定</a>
			    </form>	   
		</div>
	</div>	
</div>
</body>
</html>